﻿/*
Dojo widget for editing a list of strings. Also see property type PropertyStringList in /Models/Properties.
*/

define([
    "dojo/_base/array",
    "dojo/_base/connect",
    "dojo/_base/declare",
    "dojo/_base/lang",
    "dojo/parser",

    "dijit/focus",
    "ow-epi-numberSpinner/widgets/numberSpinner",
    "dijit/_CssStateMixin",
    "dijit/_Widget",
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin",
    "epi-cms/legacy/LegacyDialogPopup",
    "epi-cms/widget/_HasChildDialogMixin",

    "epi/epi",
    "epi/shell/widget/_ValueRequiredMixin",
    "epi/routes",

    "dojo/text!./GeoViewPortSelector.html",

    "xstyle/css!./GeoViewPortSelector.css"

],
function (
    array,
    connect,
    declare,
    lang,
    parser,

    focusManager,

    NumberSpinner,
    _CssStateMixin,
    _Widget,
    _TemplatedMixin,
    _WidgetsInTemplateMixin,
    LegacyDialogPopup,
    _HasChildDialogMixin,

    epi,
    _ValueRequiredMixin,
    routes,

    template
) {

    return declare("ow-epi-geoProperties.widgets.GeoViewPortSelector", [_Widget, _TemplatedMixin, _WidgetsInTemplateMixin, _CssStateMixin, _ValueRequiredMixin, _HasChildDialogMixin], {

        templateString: template,

        baseClass: "geoViewPortSelector",

        helptext: "Place select area",

        intermediateChanges: false,

        value: null,

        onChange: function (value) {
            // Event
        },

        postCreate: function () {
            // call base implementation
            this.inherited(arguments);
            this.connect(this.buttonClear, "onClick", this._onClearClick);

            //translations
            this.hyperlinkSelectLocation.innerText = this.selectViewPortText;
            this.buttonClear.setLabel(this.clearText);
        },

        _onClearClick: function () {
            if (this.readOnly) {
                return;
            }

            this.set("value", null);
        },

        postMixInProperties: function () {
            this.inherited(arguments);
        },

        isValid: function () {
            // summary:
            //    Check if widget's value is valid.
            // tags:
            //    protected, override

            return true;
        },

        // Setter for value property
        _setValueAttr: function (value) {
            this._setImageSource(this.thumbnail, this.noLocationNode, this._getViewPortImageUrl(value));

            this._set("value", value);
        },

        _setReadOnlyAttr: function (value) {
            this._set("readOnly", value);
            this.buttonClear.set("disabled", value);
        },

        _setStateAttr: function (value) {
            this._set("state", value);
        },

        // Setter for intermediateChanges
        _setIntermediateChangesAttr: function (value) {
            this._set("intermediateChanges", value);
        },

        _getViewPortImageUrl: function (viewPort) {
            if (viewPort) {                
                return "//maps.googleapis.com/maps/api/staticmap?&size=".concat(this.googleMapsApiInfo.width, "x", this.googleMapsApiInfo.height,
                    "&visible=", viewPort.southWest.latitude, ",", viewPort.southWest.longitude, "|", viewPort.northEast.latitude, ",", viewPort.northEast.longitude, "&sensor=false&key=", this.googleMapsApiKey);
            } else {
                return null;
            }
        },

        _setImageSource: function (thumbnailElement, noImageElement, src) {
            thumbnailElement.src = src;
            dojo.style(thumbnailElement, 'display', src ? 'block' : 'none');
            dojo.style(noImageElement, 'display', src ? 'none' : 'table-cell');
            dojo.style(this.buttonClear, 'display', src ? 'inline-block' : 'none');
        },               

        _selectLocation: function () {
            if (this.readOnly) {
                return;
            }

            this.onFocus();

            if (!this._dialog) {
                var params = this._getLegacyDialogParameters();

                var legacyDialogUrl = this._getLegacyDialogUrl();
                this._dialog = new LegacyDialogPopup(lang.mixin(params, {
                    url: legacyDialogUrl,
                    closeIconVisible: true
                }));

                this.connect(this._dialog, "onCallback", this._onDialogCallback);
                this.connect(this._dialog, 'onHide', this._onDialogHide);
            }

            this.isShowingChildDialog = true;

            this._dialog.show();
        },

        _onDialogCallback: function (value) {
            // cancel
            if (!value) {
                return;
            }

            if (value.closeAction === "insert" && value.viewPort) {
                this.set("value", value.viewPort);
            }
            else if (value.closeAction == "clear") {
                this.set("value", null);
            }

            this.onChange(value.viewPort);

        },

        destroy: function () {
            if (this._dialog) {
                this._dialog.destroyRecursive();
                delete this._dialog;
            }

            this.inherited(arguments);
        },

        _onDialogHide: function () {
            this.isShowingChildDialog = false;

            this._dialog.destroyRecursive();
            delete this._dialog;

            focusManager.focus(this.thumbnail);
        },

        _getLegacyDialogParameters: function () {
            return {
                autoFit: true,
                features: {
                    width: 700,
                    height: 500
                }
            };
        },

        _getLegacyDialogUrl: function () {

            var params = {};
            if (this.value) {
                params.viewPort = dojo.toJson(this.value);
            }

            return routes.getActionPath(params, this.geoViewPortDialogUrl);
        }
    });
});